// 获取需要权限判断的路由配置表
import {
    fixedRouter
} from ".";
import {
    permissionRouter
} from './permissionRouter.js';
import router from ".";

import store from '../store'

// 路由表是否筛选
// var addRouFlag = false

let addRouFlag = store.state.exitData.quitState

console.log("addAnRouter",addRouFlag);

store.commit("exitData/checkoutState_true")

console.log("addAnRouter",addRouFlag);

// console.log("是否筛选", addRouFlag);

router.beforeEach((to, from, next) => {
    // 取到 roles 角色
    let GetRole = localStorage.getItem("roles")
    // 获取 token 令牌
    let GetToken = localStorage.getItem("token")

    // 根据 token 判断是否登录
    if (to.name !== "Login" && !GetToken) {

        // console.log("判断是否登录 -- 此处未登录");
        // 未登录
        next({
            name: "Login"
        })
    } else {

        // 已登录
        if (GetRole && GetRole !== 'unload') {
            // console.log("判断是否登录 -- 此处已登录");
            // console.log("GetRole && GetRole !== 'unload'")

            // 1. 如果路由表 没有根据角色进行筛选, 就筛选一次
            if (!addRouFlag) {
                // console.log("!addRouFlag", !addRouFlag)
                // store.commit("exitData/checkoutState_true")

                console.log(store.state.exitData.quitState);
                addRouFlag = true

                // console.log("是否筛选", addRouFlag);

                // 2. 根据角色和需要动态展示的路由,生成符合角色的路由
                var getRoutes = baseRoleGetRouters(permissionRouter, GetRole.split(','))
                // console.log('筛选之后的路由表:', getRoutes)
                // 3. 利用 global 属性, 让渲染菜单的组件 从新渲染
                // global.antRouter = fixedRouter.concat(getRoutes).splice(1)
                // 3. 利用 Vuex 的 store 将数据挂上, 便于侧边栏渲染
                addAnRouter(fixedRouter.concat(getRoutes).splice(1))
                // console.log("global.anRouter", global.antRouter);
                // 4. 将生成好的路由 addEoutes
                router.addRoutes(fixedRouter.concat(getRoutes))
                //5. push 之后, 会重新进入到 beforeEach 的钩子里, 直接进入第一个 if 判断
                router.push({
                    path: to.path
                })
            }

            next()
        }
        next()
    }
    next()
})

function hasPermission(route, roles) {
    if (route.meta && route.meta.roles) {
        return roles.some(role => route.meta.roles.indexOf(role) >= 0)
    } else {
        return true
    }
}

// 根据用户的角色取到该用户对应的路由
function baseRoleGetRouters(allRoutes, roles) {
    // console.log('分割后权限:', roles)
    // allRoutes 是动态路由表
    // roles 是取到用户角色, 数组
    let rightRoutes = allRoutes.filter((route) => {
        if (hasPermission(route, roles)) {
            if (route.children && route.children.length) {
                route.children = baseRoleGetRouters(route.children, roles)
            }
            return true
        }
        return false
    })

    return rightRoutes
}

// 将处理后的路由 添加到 vuex 中进行管理
function addAnRouter(anRouterArr) {
    store.commit('menuData/addAnRouter', anRouterArr)
}